<template>
  <tr>
      <td v-for="(option, index) in 3" :key="index">
          <el-select v-model="selectedOptions[index]" placeholder="请选择" clearable>
              <el-option v-for="item in filteredOptions(index)" 
                :key="item.value" 
                :label="item.label" 
                :value="item.value">
              </el-option>
          </el-select>
      </td>
  </tr>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue';
import { ElSelect, ElOption } from 'element-plus';

export default defineComponent({
  components: {
      ElSelect,
      ElOption,
  },
  setup() {
      const optionList = ref([
          { label: '选项1', value: 'option1' },
          { label: '选项2', value: 'option2' },
          { label: '选项3', value: 'option3' },
      ]);
      const selectedOptions = ref([] as string[]);

      function filteredOptions(index: number) {
          const selectedValues = selectedOptions.value.filter((value, i) => i !== index);
          return optionList.value.filter(option => !selectedValues.includes(option.value));
      }

      return {
          optionList,
          selectedOptions,
          filteredOptions,
      };
  },
});
</script>
